﻿@using System.Web.Mvc.Html
@using VietTrips.Domain.Models

@{
    ViewBag.Title = "Trang Chủ";
}

@section featured {

<div id="slider_wrapper">
    <div class="owl-slider-wrapper center-capture">
        <div id="owl-slider-nav" class="owl-carousel">
            <div class="item">
                <img class="lazyOwl" data-src="@Url.Content("~/Content/frontend/images/sliders/owlSlider-03.jpg")" alt="Owl Slider" />
                <div class="owl-capture">
                    <p class="owl-price">Chỉ từ 2,000,000đ</p>
                    <h2><a href="~/Content/frontend/page-details.html" class="right-capture">Kỳ Quan Thiên Nhiên Thế Giới</a></h2>
                    <p>Hạ Long, Việt Nam</p>
                </div>
            </div>
        </div>

        <div class="owl-slider-nav">
            <a class="osn-prev"><i class="arrow_carrot-left_alt2"></i></a>
            <a class="osn-next"><i class="arrow_carrot-right_alt2"></i></a>
        </div>

    </div>

</div>
}


@Html.Partial("_SearchPartial")

<div class="row clearfix pv-30 mt-20">
    <div class="col-xs-12 col-sm-12 col-md-12">


        <h3 class="section-title mb-30">Best Offers</h3>

        <div class="item-carousel-wrapper product-3">
            <div class="item-carousel-navigation">
                <a class="item-carousel4-auto-prev icnp"><i class="icon icon-left-open-big"></i></a>
                <a class="item-carousel4-auto-next icnn"><i class="icon icon-right-open-big"></i></a>
            </div>
            <div id="item-carousel-col-4-auto" class="owl-carousel">
                <div class="item">
                    <div class="list-item">
                        <div class="list-item-image">
                            <div class="image-inner">
                                <a class="link-image" href="~/Content/frontend/page-details.html">
                                    <img src="~/Content/frontend/images/list-items/item1.jpg" alt="Best Offers" />
                                    <div class="image-overlay">
                                        <div class="overlay-content">
                                            <div class="overlay-icon"><i class="icon_link"></i></div>
                                        </div><!--/ .extra-content-->
                                    </div><!--/ .image-extra-->
                                </a>
                            </div>
                        </div><!-- end list-item -->
                        <div class="list-item-label">
                            <h4 class="list-item-title"><a href="~/Content/frontend/page-details.html" class="inverse">The Naka Island</a></h4>
                            <p class="line-h16px">Phuket, Thailand</p>
                            <div class="clear"></div>
                            <div class="list-item-save">
                                <span class="text-bold">45 sec remaining</span>
                                Save 40%
                            </div>
                            <div class="list-item-price">
                                <span>$250</span><a href="~/Content/frontend/index-header-04-modal.html">$150</a>
                            </div>
                        </div><!-- end list-item-label -->
                    </div>
                </div>
                <div class="item">
                    <div class="list-item">
                        <div class="list-item-image">
                            <div class="image-inner">
                                <a class="link-image" href="~/Content/frontend/page-details.html">
                                    <img src="~/Content/frontend/images/list-items/item2.jpg" alt="Best Offers" />
                                    <div class="image-overlay">
                                        <div class="overlay-content">
                                            <div class="overlay-icon"><i class="icon_link"></i></div>
                                        </div><!--/ .extra-content-->
                                    </div><!--/ .image-extra-->
                                </a>
                            </div>
                        </div><!-- end list-item -->
                        <div class="list-item-label">
                            <h4 class="list-item-title mb-10"><a href="~/Content/frontend/page-details.html" class="inverse">The Hilton Maldives Resort & Spa</a></h4>
                            <p class="line-h16px">Rangali Island, Maldives</p>
                            <div class="clear"></div>
                            <div class="list-item-save">
                                <span class="text-bold">120 sec remaining</span>
                                Save 50%
                            </div>
                            <div class="list-item-price">
                                <span>$300</span><a href="~/Content/frontend/index-header-04-modal.html">$230</a>
                            </div>
                        </div><!-- end list-item-label -->
                    </div>
                </div>
                <div class="item">
                    <div class="list-item">
                        <div class="list-item-image">
                            <div class="image-inner">
                                <a class="link-image" href="~/Content/frontend/page-details.html">
                                    <img src="~/Content/frontend/images/list-items/item3.jpg" alt="Best Offers" />
                                    <div class="image-overlay">
                                        <div class="overlay-content">
                                            <div class="overlay-icon"><i class="icon_link"></i></div>
                                        </div><!--/ .extra-content-->
                                    </div><!--/ .image-extra-->
                                </a>
                            </div>
                        </div><!-- end list-item -->
                        <div class="list-item-label">
                            <h4 class="list-item-title mb-10"><a href="~/Content/frontend/page-details.html" class="inverse">Anantara Seminyak Resort & Spa</a></h4>
                            <p class="line-h16px">Bali, Indonesia</p>
                            <div class="clear"></div>
                            <div class="list-item-save">
                                <span class="text-bold">21 min remaining</span>
                                Save 30%
                            </div>
                            <div class="list-item-price">
                                <span>$540</span><a href="~/Content/frontend/index-header-04-modal.html">$400</a>
                            </div>
                        </div><!-- end list-item-label -->
                    </div>
                </div>
                <div class="item">
                    <div class="list-item">
                        <div class="list-item-image">
                            <div class="image-inner">
                                <a class="link-image" href="~/Content/frontend/page-details.html">
                                    <img src="~/Content/frontend/images/list-items/item4.jpg" alt="Best Offers" />
                                    <div class="image-overlay">
                                        <div class="overlay-content">
                                            <div class="overlay-icon"><i class="icon_link"></i></div>
                                        </div><!--/ .extra-content-->
                                    </div><!--/ .image-extra-->
                                </a>
                            </div>
                        </div><!-- end list-item -->
                        <div class="list-item-label">
                            <h4 class="list-item-title mb-10"><a href="~/Content/frontend/page-details.html" class="inverse">Shanti Maurice</a></h4>
                            <p class="line-h16px">Grenier, Mauritius</p>
                            <div class="clear"></div>
                            <div class="list-item-save">
                                <span class="text-bold">45 min remaining</span>
                                Save 45%
                            </div>
                            <div class="list-item-price">
                                <span>$700</span><a href="~/Content/frontend/index-header-04-modal.html">$550</a>
                            </div>
                        </div><!-- end list-item-label -->
                    </div>
                </div>
                <div class="item">
                    <div class="list-item">
                        <div class="list-item-image">
                            <div class="image-inner">
                                <a class="link-image" href="~/Content/frontend/page-details.html">
                                    <img src="~/Content/frontend/images/list-items/item5.jpg" alt="Best Offers" />
                                    <div class="image-overlay">
                                        <div class="overlay-content">
                                            <div class="overlay-icon"><i class="icon_link"></i></div>
                                        </div><!--/ .extra-content-->
                                    </div><!--/ .image-extra-->
                                </a>
                            </div>
                        </div><!-- end list-item -->
                        <div class="list-item-label">
                            <h4 class="list-item-title mb-10"><a href="~/Content/frontend/page-details.html" class="inverse">Mandarin Oriental</a></h4>
                            <p class="line-h16px">Orchard, Singapore</p>
                            <div class="clear"></div>
                            <div class="list-item-save">
                                <span class="text-bold">1 hr 23 min remaining</span>
                                Save 50%
                            </div>
                            <div class="list-item-price">
                                <span>$300</span><a href="~/Content/frontend/index-header-04-modal.html">$600</a>
                            </div>
                        </div><!-- end list-item-label -->
                    </div>
                </div>
                <div class="item">
                    <div class="list-item">
                        <div class="list-item-image">
                            <div class="image-inner">
                                <a class="link-image" href="~/Content/frontend/page-details.html">
                                    <img src="~/Content/frontend/images/list-items/item5.jpg" alt="Best Offers" />
                                    <div class="image-overlay">
                                        <div class="overlay-content">
                                            <div class="overlay-icon"><i class="icon_link"></i></div>
                                        </div><!--/ .extra-content-->
                                    </div><!--/ .image-extra-->
                                </a>
                            </div>
                        </div><!-- end list-item -->
                        <div class="list-item-label">
                            <h4 class="list-item-title mb-10"><a href="~/Content/frontend/page-details.html" class="inverse">Marina Bay Sands</a></h4>
                            <p class="line-h16px">Orchard, Singapore</p>
                            <div class="clear"></div>
                            <div class="list-item-save">
                                <span class="text-bold">12 hr 01 min remaining</span>
                                Save 40%
                            </div>
                            <div class="list-item-price">
                                <span>$250</span><a href="~/Content/frontend/index-header-04-modal.html">$150</a>
                            </div>
                        </div><!-- end list-item-label -->
                    </div>
                </div>
                <div class="item">
                    <div class="list-item">
                        <div class="list-item-image">
                            <div class="image-inner">
                                <a class="link-image" href="~/Content/frontend/page-details.html">
                                    <img src="~/Content/frontend/images/list-items/item7.jpg" alt="Best Offers" />
                                    <div class="image-overlay">
                                        <div class="overlay-content">
                                            <div class="overlay-icon"><i class="icon_link"></i></div>
                                        </div><!--/ .extra-content-->
                                    </div><!--/ .image-extra-->
                                </a>
                            </div>
                        </div><!-- end list-item -->
                        <div class="list-item-label">
                            <h4 class="list-item-title mb-10"><a href="~/Content/frontend/page-details.html" class="inverse">Madinat Jumeirah</a></h4>
                            <p class="line-h16px">Dubai, UAE</p>
                            <div class="clear"></div>
                            <div class="list-item-save">
                                <span class="text-bold">2 days 19 hr remaining</span>
                                Save 40%
                            </div>
                            <div class="list-item-price">
                                <span>$150</span><a href="~/Content/frontend/index-header-04-modal.html">$90</a>
                            </div>
                        </div><!-- end list-item-label -->
                    </div>
                </div>
                <div class="item">
                    <div class="list-item">
                        <div class="list-item-image">
                            <div class="image-inner">
                                <a class="link-image" href="~/Content/frontend/page-details.html">
                                    <img src="~/Content/frontend/images/list-items/item8.jpg" alt="Best Offers" />
                                    <div class="image-overlay">
                                        <div class="overlay-content">
                                            <div class="overlay-icon"><i class="icon_link"></i></div>
                                        </div><!--/ .extra-content-->
                                    </div><!--/ .image-extra-->
                                </a>
                            </div>
                        </div><!-- end list-item -->
                        <div class="list-item-label">
                            <h4 class="list-item-title mb-10"><a href="~/Content/frontend/page-details.html" class="inverse">Silavadee Pool Spa Resort</a></h4>
                            <p class="line-h16px">Koh Samui, Thailand</p>
                            <div class="clear"></div>
                            <div class="list-item-save">
                                <span class="text-bold">4 days 21 hr remaining</span>
                                Save 40%
                            </div>
                            <div class="list-item-price">
                                <span>$250</span><a href="~/Content/frontend/index-header-04-modal.html">$150</a>
                            </div>
                        </div><!-- end list-item-label -->
                    </div>
                </div>
            </div>
        </div>

    </div>
    <div class="clear"></div>

    <div class="col-xs-12 col-sm-12 col-md-12 mt-30">
        <div class="gr-style"></div>
        <h3 class="section-title mv-30">Top Destinations</h3>
    </div>

    <div class="produc-item">
        <div class="col-xs-12 col-sm-6 col-md-3">
            <div class="list-item">
                <div class="list-item-image">
                    <div class="image-inner">
                        <a class="link-image" href="~/Content/frontend/page-details.html">
                            <img src="~/Content/frontend/images/list-items/top-destination-05.jpg" alt="Image" />
                            <div class="image-overlay">
                                <div class="overlay-content">
                                    <div class="overlay-icon"><i class="icon_link"></i></div>
                                </div><!--/ .extra-content-->
                            </div><!--/ .image-extra-->
                        </a>
                    </div>
                </div><!-- end list-item -->
                <div class="list-item-label">
                    <h4 class="list-item-title"><a href="~/Content/frontend/page-details.html">Bora Bora</a></h4>
                    <div class="list-item-price">
                        <a href="~/Content/frontend/index-header-04-modal.html"><i class="fa-arrow-right"></i></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-12 col-sm-6 col-md-3">
            <div class="list-item">
                <div class="list-item-image">
                    <div class="image-inner">
                        <a class="link-image" href="~/Content/frontend/page-details.html">
                            <img src="~/Content/frontend/images/list-items/top-destination-06.jpg" alt="Image" />
                            <div class="image-overlay">
                                <div class="overlay-content">
                                    <div class="overlay-icon"><i class="icon_link"></i></div>
                                </div><!--/ .extra-content-->
                            </div><!--/ .image-extra-->
                        </a>
                    </div>
                </div><!-- end list-item -->
                <div class="list-item-label">
                    <h4 class="list-item-title"><a href="~/Content/frontend/page-details.html">Hong Kong, China</a></h4>
                    <div class="list-item-price">
                        <a href="~/Content/frontend/index-header-04-modal.html"><i class="fa-arrow-right"></i></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-12 col-sm-6 col-md-3">
            <div class="list-item">
                <div class="list-item-image">
                    <div class="image-inner">
                        <a class="link-image" href="~/Content/frontend/page-details.html">
                            <img src="~/Content/frontend/images/list-items/top-destination-07.jpg" alt="Image" />
                            <div class="image-overlay">
                                <div class="overlay-content">
                                    <div class="overlay-icon"><i class="icon_link"></i></div>
                                </div><!--/ .extra-content-->
                            </div><!--/ .image-extra-->
                        </a>
                    </div>
                </div><!-- end list-item -->
                <div class="list-item-label">
                    <h4 class="list-item-title"><a href="~/Content/frontend/page-details.html">Mykonos, Greece</a></h4>
                    <div class="list-item-price">
                        <a href="~/Content/frontend/index-header-04-modal.html"><i class="fa-arrow-right"></i></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-12 col-sm-6 col-md-3">
            <div class="list-item">
                <div class="list-item-image">
                    <div class="image-inner">
                        <a class="link-image" href="~/Content/frontend/page-details.html">
                            <img src="~/Content/frontend/images/list-items/top-destination-08.jpg" alt="Image" />
                            <div class="image-overlay">
                                <div class="overlay-content">
                                    <div class="overlay-icon"><i class="icon_link"></i></div>
                                </div><!--/ .extra-content-->
                            </div><!--/ .image-extra-->
                        </a>
                    </div>
                </div><!-- end list-item -->
                <div class="list-item-label">
                    <h4 class="list-item-title"><a href="~/Content/frontend/page-details.html">San Francisco, USA</a></h4>
                    <div class="list-item-price">
                        <a href="~/Content/frontend/index-header-04-modal.html"><i class="fa-arrow-right"></i></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-12 col-sm-6 col-md-3">
            <div class="list-item">
                <div class="list-item-image">
                    <div class="image-inner">
                        <a class="link-image" href="~/Content/frontend/page-details.html">
                            <img src="~/Content/frontend/images/list-items/top-destination-01.jpg" alt="Image" />
                            <div class="image-overlay">
                                <div class="overlay-content">
                                    <div class="overlay-icon"><i class="icon_link"></i></div>
                                </div><!--/ .extra-content-->
                            </div><!--/ .image-extra-->
                        </a>
                    </div>
                </div><!-- end list-item -->
                <div class="list-item-label">
                    <h4 class="list-item-title"><a href="~/Content/frontend/page-details.html">Dubai, UAE</a></h4>
                    <div class="list-item-price">
                        <a href="~/Content/frontend/index-header-04-modal.html"><i class="fa-arrow-right"></i></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-12 col-sm-6 col-md-3">
            <div class="list-item">
                <div class="list-item-image">
                    <div class="image-inner">
                        <a class="link-image" href="~/Content/frontend/page-details.html">
                            <img src="~/Content/frontend/images/list-items/top-destination-02.jpg" alt="Image" />
                            <div class="image-overlay">
                                <div class="overlay-content">
                                    <div class="overlay-icon"><i class="icon_link"></i></div>
                                </div><!--/ .extra-content-->
                            </div><!--/ .image-extra-->
                        </a>
                    </div>
                </div><!-- end list-item -->
                <div class="list-item-label">
                    <h4 class="list-item-title"><a href="~/Content/frontend/page-details.html">Varenna, Italy</a></h4>
                    <div class="list-item-price">
                        <a href="~/Content/frontend/index-header-04-modal.html"><i class="fa-arrow-right"></i></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-12 col-sm-6 col-md-3">
            <div class="list-item">
                <div class="list-item-image">
                    <div class="image-inner">
                        <a class="link-image" href="~/Content/frontend/page-details.html">
                            <img src="~/Content/frontend/images/list-items/top-destination-03.jpg" alt="Image" />
                            <div class="image-overlay">
                                <div class="overlay-content">
                                    <div class="overlay-icon"><i class="icon_link"></i></div>
                                </div><!--/ .extra-content-->
                            </div><!--/ .image-extra-->
                        </a>
                    </div>
                </div><!-- end list-item -->
                <div class="list-item-label">
                    <h4 class="list-item-title"><a href="~/Content/frontend/page-details.html">Santorini, Greece</a></h4>
                    <div class="list-item-price">
                        <a href="~/Content/frontend/index-header-04-modal.html"><i class="fa-arrow-right"></i></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-12 col-sm-6 col-md-3">
            <div class="list-item">
                <div class="list-item-image">
                    <div class="image-inner">
                        <a class="link-image" href="~/Content/frontend/page-details.html">
                            <img src="~/Content/frontend/images/list-items/top-destination-04.jpg" alt="Image" />
                            <div class="image-overlay">
                                <div class="overlay-content">
                                    <div class="overlay-icon"><i class="icon_link"></i></div>
                                </div><!--/ .extra-content-->
                            </div><!--/ .image-extra-->
                        </a>
                    </div>
                </div><!-- end list-item -->
                <div class="list-item-label">
                    <h4 class="list-item-title"><a href="~/Content/frontend/page-details.html">New York, USa</a></h4>
                    <div class="list-item-price">
                        <a href="~/Content/frontend/index-header-04-modal.html"><i class="fa-arrow-right"></i></a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>